<!DOCTYPE html>
<html lang="en">

<!--
  Author：蓝田_Loto
  Date：2018-10-17 10:04
  PageName：a_imageStyle_Size.html
  Function：定义图像大小
  URL：http://localhost:8080/f_image/f2_image_Style/a_imageStyle_Size.html
-->

<head>
    <meta charset="UTF-8">
    <title>定义图像大小</title>

    <style type="text/css">
        /* 定义固定大小的包含框 */
        div {
            height: 200px;             /* 固定高度 */
            width: 50%;                /* 设计弹性宽度 */
            border: solid 1px red;     /* 定义一个边框 */
        }

        /* 定义图像大小 */
        img {
            width: 50%;   /* 百分比宽度 */
            height: 50%;  /* 百分比高度 */
        }
    </style>
</head>

<body>
<div><img src="images/TD.jpg"/></div>
<img src="images/TD.jpg"/>
</body>
</html>